-
Notifications
You must be signed in to change notification settings - Fork 82
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Local Components #44
base: master
Are you sure you want to change the base?
Local Components #44
Conversation
A bit of syntax that Svelte sorta has already (and that isn't easily found in the documentation) is this: <!-- @component JSDoc-esque component documentation can go here. -->
<script/>
<style/>
<content/> More to the point, I think using a comment is a bit... vague? I feel like it could cause edge cases. Instead, I would prefer something like this: {@component foo}
<script/>
<style/>
<content/> This keeps the intuition of the Alternatively, you could use the proposed |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Scho
I was coming to find out if someone had an idea like this. I agree with the reasoning, even if I'm not 100% convinced it's strictly needed. It could make demos more concise too. I dislike using comments semantically, though I think we already have a solution built in, just need to repurpose it: <script context="module">/* ... */</script>
<!-- This is a component accessible as <Foo> _inside_ this file only -->
<svelte:component name=Foo><!-- ... --></svelte:component>
<!-- This is a component accessible as <Bar> _inside_ this file only. It is exported by name as well. -->
<svelte:component export name=Bar><!-- ... --></svelte:component>
<!-- Any other content _outside_ the svelte:component remains the default export -->
<script>
// Blah blah.
</script>
<Foo /> <!-- Didn't need to be imported since it's defined in-file -->
<Bar /> <!-- Didn't need to be imported since it's defined in-file --> If you have an exported svelte:component the default export is optional. |
One file, one component. It is simple, clean and prepare to reusable. |
Yeah I caught myself thinking about small one-off modal templates today and wondering if frameworks (not just Svelte) should support inline/local components. Then I stopped myself.
Honestly this one seems like an antifeature to me, unless people can provide several examples where it's really useful. Seems like it would take quite a bit of work to implement. |
Click here to read the RFC
please do not comment hot takes unless you've read the RFC 😄, below is just a TL;DR
Components often require their own private building blocks,
unfortunately in Svelte you must create a new file to declare a component.
This RFC proposes for
.svelte
files to define named components after the default exportdefining a local component is done at the top level through a non-indentating syntax such as
<!-- LocalComponentName -->